/*!
 * Bootstrap v3.0.0
 *
 * Copyright 2013 Twitter, Inc
 * Licensed under the Apache License v2.0
 * http://www.apache.org/licenses/LICENSE-2.0
 *
 * Designed and built with all the love in the world by @mdo and @fat.
 */

/*!
 * We imported some codes of bootstrap, and added added our own's
 */

//
// Mixins
// --------------------------------------------------

// Utilities
// -------------------------

// Clearfix
// Source: http://nicolasgallagher.com/micro-clearfix-hack/
//
// For modern browsers
// 1. The space content is one way to avoid an Opera bug when the
//    contenteditable attribute is included anywhere else in the document.
//    Otherwise it causes space to appear at the top and bottom of elements
//    that are clearfixed.
// 2. The use of `table` rather than `block` is only necessary if using
//    `:before` to contain the top-margins of child elements.
.clearfix() {
  &:before,
  &:after {
    content: " "; /* 1 */
    display: table; /* 2 */
  }
  &:after {
    clear: both;
  }
}

// Webkit-style focus
.tab-focus() {
  // Default
  outline: thin dotted #333
;
  // Webkit
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px;
}

// Center-align a block level element
.center-block() {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

// Sizing shortcuts
.size(@width, @height) {
  width: @width;
  height: @height;
}

.square(@size) {
  .size(@size, @size);
}

// Placeholder text
.placeholder(@color: @input-color-placeholder) {
  &:-moz-placeholder {
    color: @color;
  }
  // Firefox 4-18
  &::-moz-placeholder {
    color: @color;
  }
  // Firefox 19+
  &:-ms-input-placeholder {
    color: @color;
  }
  // Internet Explorer 10+
  &::-webkit-input-placeholder {
    color: @color;
  }
  // Safari and Chrome
}

// Text overflow
// Requires inline-block or block for proper styling
.text-overflow() {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

// CSS3 PROPERTIES
// --------------------------------------------------

// All sides border-radius
.border-radius(@radius) {
  border-radius: @radius;
  -webkit-border-radius: @radius;
  -moz-border-radius: @radius;
}

// Single side border-radius
.border-top-radius(@radius) {
  border-top-right-radius: @radius;
  border-top-left-radius: @radius;
}

.border-right-radius(@radius) {
  border-bottom-right-radius: @radius;
  border-top-right-radius: @radius;
}

.border-bottom-radius(@radius) {
  border-bottom-right-radius: @radius;
  border-bottom-left-radius: @radius;
}

.border-left-radius(@radius) {
  border-bottom-left-radius: @radius;
  border-top-left-radius: @radius;
}

// Box sizing
.box-sizing(@boxmodel) {
  -webkit-box-sizing: @boxmodel;
  -moz-box-sizing: @boxmodel;
  box-sizing: @boxmodel;
}

// User select
// For selecting text on the page
.user-select(@select) {
  -webkit-user-select: @select;
  -moz-user-select: @select;
  -ms-user-select: @select; // IE10+
  -o-user-select: @select;
  user-select: @select;
}

// Drop shadows
.box-shadow(@shadow) {
  -webkit-box-shadow: @shadow; // iOS <4.3 & Android <4.1
  box-shadow: @shadow;
}

// Grid System
// --------------------------------------------------

// Centered grid element
.grid-fixed(@grid-total-width: @grid-total-width) {
  width: @grid-total-width;
  .centered();
  .clearfix();
}

// Creates a wrapper for a series of columns
.make-row() {
  // Then clear the floated columns
  .clearfix();
  .hidden {
    visibility: hidden;
  }
}

// Generate the columns
.make-column(@column, @grid-total-width: @grid-total-width, @grid-columns: @grid-columns, @grid-gutter-width: @grid-gutter-width) {
  @grid-column-width: @grid-total-width / @grid-columns - @grid-gutter-width;
  float: left;
  // Prevent columns from collapsing when empty
  min-height: 1px;
  _display: inline;
  margin-left: @grid-gutter-width / 2;
  margin-right: @grid-gutter-width / 2;
  width: @grid-column-width * @column + (@column - 1) * @grid-gutter-width;
}

// Generate the column offsets
.make-column-offset(@column, @grid-total-width: @grid-total-width, @grid-columns: @grid-columns, @grid-gutter-width: @grid-gutter-width) {
  margin-left: @grid-total-width / @grid-columns * @column + @grid-gutter-width / 2;
}

// Creates a wrapper for a series of columns
.make-row-fluid() {
  // Then clear the floated columns
  .clearfix();
  width: 100%;
  .hidden {
    visibility: hidden;
  }
}

// Generate the columns
.make-column-fluid(@column) {
  @grid-content-width: @grid-total-width - @grid-gutter-width;
  @grid-column-width: @grid-total-width / @grid-columns - @grid-gutter-width;
  display: block;
  _display: inline;
  margin-right: 0;
  margin-left: percentage(@grid-gutter-width / @grid-content-width);
  width: percentage((@grid-column-width * @column + (@column - 1) * @grid-gutter-width) / @grid-content-width);
  *width: percentage((@grid-column-width * @column + (@column - 1) * @grid-gutter-width) / @grid-content-width - 0.00065);
}

// Generate the column offsets
.make-column-fluid-offset(@column) {
  @grid-content-width: @grid-total-width - @grid-gutter-width;
  @grid-column-width: @grid-total-width / @grid-columns - @grid-gutter-width;
  margin-left: percentage((@grid-column-width * @column + (@column + 1) * @grid-gutter-width) / @grid-content-width);
}

// Button variants
// -------------------------
// Easily pump out default styles, as well as :hover, :focus, :active,
// and disabled options for all buttons
.button-variant(@color, @background, @border) {
  color: @color;
  background-color: @background;
  border-color: @border;

  &:hover,
  &:focus,
  &:active,
  &.active,
  .open .dropdown-toggle& {
    color: @color;
    background-color: darken(@background, 8%);
    border-color: darken(@border, 12%);
  }
  &:active,
  &.active,
  .open .dropdown-toggle& {
    background-image: none;
  }
  &.disabled,
  &[disabled],
  fieldset[disabled] & {
    &,
    &:hover,
    &:focus,
    &:active,
    &.active {
      background-color: @background;
      border-color: @border
    }
  }
}

// Button sizes
// -------------------------
.button-size(@padding-vertical, @padding-horizontal, @font-size, @line-height, @border-radius) {
  padding: @padding-vertical @padding-horizontal;
  font-size: @font-size;
  line-height: @line-height;
  border-radius: @border-radius;
}

// OTHERS
// --------------------------------------------------

// Opacity
.opacity(@opacity) {
  opacity: @opacity;
  // IE8 filter
  @opacity-ie: (@opacity * 100);
  filter: ~"alpha(opacity=@{opacity-ie})";
}

.centered() {
  margin-left: auto;
  margin-right: auto;
}
